import React from 'react';
import { Container, Icon, Popup } from 'semantic-ui-react';
// import CopybookModel from '../models/CopybookModel';

export default function NavBarContainer() {
  // function handleOpenCopybook() {
  //   // CopybookModel.update({ visible: true });
  // }

  return (
    <Container className='nav-bar-container'>
      <div className='bd'>
        {/* <Popup
          hoverable={true}
          trigger={
            <div className='copybook-btn animated fadeInDown' onClick={handleOpenCopybook}>
              <Icon name='clipboard' />
            </div>
          }>
          <Icon name='thumbs up outline' /> Daily algorithm copybook, learn algorithm easily!
        </Popup> */}
        {/*<Popup*/}
          {/*hoverable={true}*/}
          {/*trigger={*/}
            {/*<div className='bookmark-btn animated fadeInDown'>*/}
              {/*<Icon name='bookmark' />*/}
            {/*</div>*/}
          {/*}>*/}
          {/*Sorry, GitHub stars organize tool currently is not available, <a href="https://github.com/unbug/codelf/projects/2" target='_blank' rel='noopener noreferrer'>new version</a> is coming soon :)*/}
        {/*</Popup>*/}
        <a href='https://gitee.com/myicul/CODELF' className='github-corner animated fadeInDown'
          title='GitHub地址'
          target='_blank' rel='noopener noreferrer'>
          <Icon className='githubLin' name='github' />
        </a>
        <a href='https://blog.hlzyw.cn/' className='github-corner animated fadeInDown'
           title='沐一博客'
           target='_blank' rel='noopener noreferrer'>
          <img src='images/myi.png' height='70' />
          {/*<Icon name='github square' />*/}
        </a>
      </div>
    </Container>
  )
}
